import { createRouter, createWebHashHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'

import studemo01 from '../views/study0/studemo1.vue'
import studemo02 from '../views/study0/studemo2.vue'
import studemo03 from '../views/study0/studemo3.vue'
import studemo04 from '../views/study0/studemo4.vue'
import studemo05 from '../views/study0/studemo5.vue'
import studemo06 from '../views/study0/studemo6.vue'

import studemo11 from '../views/study1/studemo1.vue'
import studemo12 from '../views/study1/studemo2.vue'
import studemo13 from '../views/study1/studemo3.vue'
import studemo14 from '../views/study1/studemo4.vue'

import studemo21 from '../views/study2/studemo1.vue'
import studemo22 from '../views/study2/studemo2.vue'
import studemo23 from '../views/study2/studemo3.vue'
import studemo24 from '../views/study2/studemo4.vue'

import studemo31 from '../views/study3/studemo1.vue'
import studemo32 from '../views/study3/studemo2.vue'
import studemo33 from '../views/study3/studemo3.vue'

import studemo41 from '../views/study4/studemo1.vue'
import studemo42 from '../views/study4/studemo2.vue'

import studemo51 from '../views/study5/studemo1.vue'
import studemo52 from '../views/study5/studemo2.vue'

import studemo61 from '../views/study6/Demo1.vue'
import studemo62 from '../views/study6/Demo2.vue'

import studemo611 from '../views/study6/NavigatorOne/Option1.vue'
import studemo612 from '../views/study6/NavigatorOne/Option2.vue'


import studemos1 from '../views/10.10/studynow.vue'
import studemos2 from '../views/10.12/main.vue'

import studydemo1 from '../views/studydemo/demo1.vue'

import jiekou1 from '../views/jiekoutest/jiekou1.vue'
import jiekou2 from '../views/jiekoutest/jiekou2.vue'

import logins1 from '../views/login/dengru.vue'
import logins2 from '../views/login/yonghuzhuce.vue'

import fileupload1 from '../views/FileUpdown/File1.vue'
import fileupload2 from '../views/FileUpdown/File2.vue'
import fileupload3 from '../views/FileUpdown/File3.vue'
import fileupload4 from '../views/FileUpdown/File4.vue'
import fileupload5 from '../views/FileUpdown/File5.vue'

// 选项式API和组合式API    组合式 API (Composition API)详解
const study1 = [
  {
    path: '/studemo01',
    name: 'studemo01',
    component: studemo01
  },
  {
    path: '/studemo02',
    name: 'studemo02',
    component: studemo02
  },
  {
    path: '/studemo03',
    name: 'studemo03',
    component: studemo03
  },
  {
    path: '/studemo04',
    name: 'studemo04',
    component: studemo04
  },
  {
    path: '/studemo05',
    name: 'studemo05',
    component: studemo05
  },
  {
    path: '/studemo06',
    name: 'studemo06',
    component: studemo06
  }
]
// vue模板语法
const study2 = [
  {
    path: '/studemo11',
    name: 'studemo11',
    component: studemo11
  },
  {
    path: '/studemo12',
    name: 'studemo12',
    component: studemo12
  },
  {
    path: '/studemo13',
    name: 'studemo13',
    component: studemo13
  },
  {
    path: '/studemo14',
    name: 'studemo14',
    component: studemo14
  }
]
// 响应式基础
const study3 = [
  {
    path: '/studemo21',
    name: 'studemo21',
    component: studemo21
  },
  {
    path: '/studemo22',
    name: 'studemo22',
    component: studemo22
  },
  {
    path: '/studemo23',
    name: 'studemo23',
    component: studemo23
  },
  {
    path: '/studemo24',
    name: 'studemo24',
    component: studemo24
  }
]
// 计算属性
const study4 = [
  {
    path: '/studemo31',
    name: 'studemo31',
    component: studemo31
  },
  {
    path: '/studemo32',
    name: 'studemo32',
    component: studemo32
  },
  {
    path: '/studemo33',
    name: 'studemo33',
    component: studemo33
  }
]
// Class 与 Style 绑定
const study5 = [
  {
    path: '/studemo41',
    name: 'studemo41',
    component: studemo41
  },
  {
    path: '/studemo42',
    name: 'studemo42',
    component: studemo42
  }
]
const study6 = [
  {
    path: '/studemo51',
    name: 'studemo51',
    component: studemo51
  },
  {
    path: '/studemo52',
    name: 'studemo52',
    component: studemo52
  }
]

const study7 = [
  {
    path: '/studemo61',
    name: 'studemo61',
    component: studemo61,
    meta: { title: 'StuDemo61' },
  },
  {
    path: '/studemo62',
    name: 'studemo62',
    component: studemo62,
    meta: { title: '系统管理' },
    children: [
      {
        name: 'userManage',
        path: 'user',
        component: studemo611,
        meta: { title: '用户管理' },
      },
      {
        name: 'roleManage',
        path: 'role',
        component: studemo612,
        meta: { title: '角色管理' },
      }
    ]
  }
]


const studynow = [
  {
    path: '/studemos1',
    name: 'studemos1',
    component: studemos1
  },
  {
    path: '/studemos2',
    name: 'studemos2',
    component: studemos2
  }
]


const studydemo = [
  {
    path: '/studydemo1',
    name: 'studydemo1',
    component: studydemo1
  }
]

const jiekoutest = [
  {
    path: '/jiekou1',
    name: 'jiekou1',
    component: jiekou1
  },
  {
    path: '/jiekou2',
    name: 'jiekou2',
    component: jiekou2
  }
]

const logins = [{
  path: '/login',
  name: 'login',
  component: logins1,
},
{
  path: '/login2',
  name: 'login2',
  component: logins2,
}]

const fileUploadRoutes = [
  {
    path: '/fileupload1',
    name: 'fileupload1',
    component: fileupload1,
    meta: { title: '文件上传1' }
  },
  {
    path: '/fileupload2',
    name: 'fileupload2',
    component: fileupload2,
    meta: { title: '文件上传2' }
  },
  {
    path: '/fileupload3',
    name: 'fileupload3',
    component: fileupload3,
    meta: { title: '文件上传3' }
  },
  {
    path: '/fileupload4',
    name: 'fileupload4',
    component: fileupload4,
    meta: { title: '文件上传4' }
  },
  {
    path: '/fileupload5',
    name: 'fileupload5',
    component: fileupload5,
    meta: { title: '文件上传5' }
  }
];



export const routesList = [
  {
    path: '/',
    name: 'home',
    component: HomeView,
    meta: { title: '首页' }
  },
  ...study1,
  ...study2,
  ...study3,
  ...study4,
  ...study5,
  ...study6,
  ...study7,
  ...studynow,
  ...studydemo,
  ...jiekoutest,
  ...fileUploadRoutes,
  ...logins,

]

export const routesList1 = [
  {
    path: '/login',
    name: 'login',
    component: logins1,
    meta: { title: '用户登录' },
  },
  {
    path: '/studemo62/user',
    name: 'studemo62/user',
    component: studemo611,
    meta: { title: '用户管理' },
  },
  {
    path: '/studemo62/role',
    name: 'roleManage',
    component: studemo612,
    meta: { title: '角色管理' },
  }
]


const router = createRouter({
  // history:createWebHistory(), //history模式
  history: createWebHashHistory(), //hash模式
  routes: routesList
})

router.beforeEach((to, from, next) => {


  const token = localStorage.getItem('token')

  if (token) {
    // 如果登陆正常放过

    if (to.path === '/login') {
      next('/studemo62/user')
    } else {
      next()
    }


  } else {

    // 如果没有登陆 且 目标页面是登录页
    if (to.path === '/login') {
      next()
    } else {
      // 目标路由不是login 跳转到login
      next('/login')
    }

  }

})



export default router